/*
 * @Author: yxfan
 * @Date: 2024-10-30 11:10:24
 * @LastEditTime: 2024-11-06 15:26:09
 * @FilePath: /umi-demo/src/pages/demo/xterm-ssh/index.tsx
 * @Description: ssh 案例
 */
import { useEffect } from 'react';
// import { Terminal } from '@xterm/xterm';
import { Terminal } from 'xterm';
import { AttachAddon } from '@xterm/addon-attach';
import { FitAddon } from '@xterm/addon-fit';
import '@xterm/xterm/css/xterm.css';
import './index.less';

export default () => {
    useEffect(() => {
        initSSH();
    }, []);

    function initSSH() {
        const socket = new WebSocket('ws://127.0.0.1:8080');
        const terminal = new Terminal({
            // cursorStyle: 'underline',
            overviewRulerWidth: 100,
        });
        const fitAddon = new FitAddon();
        const addon = new AttachAddon(socket);
        terminal.loadAddon(addon);
        terminal.loadAddon(fitAddon);
        setTimeout(() => {
            terminal.open(document.getElementById('terminal'));
        });
    }

    return (
        <div className="ssh-container">
            xterm ssh
            <div id="terminal"></div>
        </div>
    );
};
